<!DOCTYPE html>
<html lang="en">
<!--头部信息-->
<head>
    <meta charset="utf-8">
    <title>已删除用户</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="../../lib/layui-v2.5.5/css/layui.css" media="all">
    <link rel="stylesheet" href="../../css/public.css" media="all">

    <script src="../../lib/layui-v2.5.5/layui.js" charset="utf-8"></script>
</head>
<!--已删除管理-->
<body>
<div class="layuimini-container">
    <div class="layuimini-main">


        <!--搜索框-->
        <fieldset class="table-search-fieldset">
            <legend>搜索信息</legend>
            <div style="margin: 10px 10px 10px 10px">
                <div class="layui-form layui-form-pane">
                    <div class="layui-form-item common" id="seach">


                        <!--ID-->
                        <div class="layui-inline">
                            <label class="layui-form-label">ID</label>
                            <div class="layui-input-inline">
                                <input name="id" id="id" type="text" lay-verify="number" class="layui-input">
                            </div>
                        </div>


                        <!--姓名-->
                        <div class="layui-inline">
                            <label class="layui-form-label">姓名</label>
                            <div class="layui-input-inline">
                                <input type="text" name="username" id="username" autocomplete="off" class="layui-input">
                            </div>
                        </div>


                        <!--搜索按钮-->
                        <div class="layui-inline">
                            <button class="layui-btn layui-btn-primary" id="search" data-type="reload"><i class="layui-icon"></i> 搜 索
                            </button>
                        </div>


                    </div>
                </div>
            </div>
        </fieldset>


        <!--表头操作-->
        <script type="text/html" id="toolbarDemo">
            <div class="layui-btn-container">
                <button class="layui-btn layui-btn-sm layui-btn-danger data-delete-btn" lay-event="delete"><i
                        class="layui-icon layui-icon-delete"></i>批量删除
                </button>
            </div>
        </script>


        <!--创建表格-->
        <table class="layui-hide" id="currentTableId" lay-filter="currentTableFilter"></table>


        <!--表内操作-->
        <script type="text/html" id="currentTableBar">
            <a class="layui-btn layui-btn-normal layui-btn-xs data-count-edit" lay-event="look">查看信息</a>
        </script>


    </div>
</div>
<script>
    layui.use(['form', 'table'], function () {
        var $ = layui.jquery,
            form = layui.form,
            table = layui.table;


        /*表格数据渲染*/
        table.render({
            elem: '#currentTableId',
            url: '/getDeleteList',
            toolbar: '#toolbarDemo',
            cellMinWidth: 50,
            height: 440,
            limit: 8,
            limits: [8, 16, 24, 32, 40],
            method: 'GET',
            text: {
                none: '暂时没有数据哦！'
            },
            defaultToolbar: ['filter', 'exports', 'print', {
                title: '已删除数据',
                layEvent: 'LAYTABLE_TIPS',
                icon: 'layui-icon-tips'
            }],
            cols: [
                [
                    {type: "checkbox", width: 30, align: "center"}
                    , {type: 'numbers', width: 50, title: '序号', align: "center"}
                    , {field: 'delId', width: 80, title: 'ID', hide: true, sort: true, align: "center"}
                    , {field: 'delName', width: 120, title: '姓名', align: "center"}
                    , {field: 'delSex', width: 80, title: '性别', align: "center"}
                    , {
                    field: 'delAge', title: '死亡寿命', sort: true, align: "center", templet: function (d) {
                        return d.delAge += "岁";
                    }
                }
                    , {field: 'delWhy', title: '死亡原因', align: "center"}
                    , {
                    field: 'delReinState', title: '是否轮回', align: "center", templet: function (d) {
                        if (d.delReinState === 1) {
                            return "否";
                        }
                        return "是";
                    }
                }
                    , {field: 'delTime', width: 180, title: '死亡时间', sort: true, align: "center"}
                    , {field: 'delLassTime', width: 180, title: '最后编辑时间', sort: true, align: "center"}
                    , {fixed: 'right', title: '操作', minWidth: 150, toolbar: '#currentTableBar', align: "center"}
                ]
            ],
            page: true,
            id: "testId"
        });


        /*搜索事件处理*/
        $('#search').click(function () {
            var reg = /^[0-9]*[1-9][0-9]*$/;
            var id = $('#id').val();
            var username = $('#username').val();
            if (id !== '') {
                if (!reg.test(id)) {
                    layer.msg("ID为整数，请重新输入！");
                    return;
                }
            }
            /*表格重载*/
            table.reload('testId', {
                page: {
                    curr: 1
                },
                where: {
                    id: id,
                    username: username
                }
            }, 'data');
        });


        /*表头按钮事件处理*/
        table.on('toolbar(currentTableFilter)', function (obj) {
            /*批量删除功能*/
            if (obj.event === 'delete') {
                var checkStatus = table.checkStatus('testId');
                /*判断是否选中数据*/
                if (checkStatus.data.length === 0) {
                    parent.layer.msg('请先选择要删除的记录！', {icon: 2});
                    return;
                }
                layer.confirm('确定要删除选中的记录吗？',{icon: 3}, function (index) {
                    layer.close(index);
                    index = layer.load(1, {shade: [0.1, '#fff']});
                    //存放要删除的ID
                    var ids = '';
                    for (var i = 0; i < checkStatus.data.length; i++) {
                        ids += checkStatus.data[i].delId + ",";
                    }
                    parent.layer.msg('删除中...', {icon: 16, shade: 0.3, time: 5000});
                    //删除请求
                    $.ajax({
                        type: 'DELETE',
                        data: {ids: ids},
                        url: '/batchDelDeleted',
                        error: function () {
                            layer.alert("系统错误！");
                        },
                        success: function (result) {
                            layer.closeAll('loading');
                            if (result === 'success') {
                                parent.layer.msg('删除成功！', {
                                    icon: 1, time: 2000, shade: 0.2, end: function () {
                                        window.location.reload();
                                    }
                                });
                                layer.close(index);
                            } else {
                                parent.layer.msg('删除失败!', {
                                    icon: 5, time: 1000, end: function () {
                                        window.location.reload()
                                    }
                                });
                                layer.close(index);
                            }
                        }
                    });
                });
            }
        });


        /*表格复选框处理*/
        table.on('checkbox(currentTableFilter)', function (obj) {
            console.log(obj)
        });


        /*表内操作事件处理*/
        table.on('tool(currentTableFilter)', function (obj) {
            var data = obj.data;
            if (obj.event === 'look') {
                var index = layer.open({
                    title: '用户信息',
                    type: 2,
                    shade: 0.2,
                    maxmin: true,
                    shadeClose: true,
                    area: ['80%', '90%'],
                    content: '/user-look',
                    success: function (layero, index) {
                        $.ajax({
                            type: 'GET',
                            url: '/getDeletedById/' + data.delId,
                            dataType: 'json',
                            error: function () {
                                layer.alert('系统错误！');
                            },
                            success: function (result) {
                                var body = layer.getChildFrame('body', index);
                                var iframeWin = window[layero.find('iframe')[0]['name']];
                                //将数据填充到子页面上
                                body.find('#delId label').text(result.delId);
                                body.find('#delDieId label').text(result.delDieId);
                                body.find('#delName label').text(result.delName);
                                body.find('#delSex label').text(result.delSex);
                                body.find('#delAge label').text(result.delAge + "岁");
                                $.ajax({
                                    type: 'GET',
                                    url: '/getDiewhyById/' + result.delWhy,
                                    datatype: 'json',
                                    error: function () {
                                        layer.alert("系统错误！");
                                    },
                                    success: function (result) {
                                        body.find('#delWhy label').text(result.name);
                                    }
                                });
                                if (result.delReinState === 1) {
                                    body.find('#delReinState label').text("未轮回");
                                } else {
                                    body.find('#delReinState label').text("已轮回");
                                }
                                body.find('#delTime label').text(result.delTime);
                                body.find('#delDesc label').text(result.delDesc);
                            }
                        });
                    }
                });
                $(window).on("resize", function () {
                    layer.full(index);
                });
                return false;
            }
        });


    })
    ;
</script>
</body>
</html>